<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>管理员后台</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/js/all.min.js"></script>
</head>
<body>

<%
    HttpSession session1 = request.getSession();
    String adminUsername = (String) session1.getAttribute("adminUsername");
    String adminAvatarUrl = (String) session1.getAttribute("adminAvatarUrl");
    String userType = (String) session1.getAttribute("userType");
    String defaultAvatar = "https://tse1-mm.cn.bing.net/th/id/OIP-C.j57souiFOvYA0LUiw-2BkAHaHa?rs=1&pid=ImgDetMain";

    if (adminUsername == null || !"admin".equals(userType)) {
        response.sendRedirect("./managerLogin.jsp");
        return;
    }
%>

<div class="container-fluid">
    <div class="row">
        <!-- 侧边栏 -->
        <nav class="col-md-3 col-lg-2 d-md-block bg-dark sidebar text-white vh-100 p-3">
            <div class="d-flex align-items-center mb-3">
                <img src="<%= (adminAvatarUrl != null && !adminAvatarUrl.isEmpty()) ? adminAvatarUrl : defaultAvatar %>" class="rounded-circle me-2" width="50" height="50" onerror="this.src='<%= defaultAvatar %>'">
                <strong><%= adminUsername %></strong>
            </div>
            <ul class="nav flex-column">
                <li class="nav-item">
                    <a class="nav-link text-white" href="#" onclick="showContent('profile')"><i class="fa fa-user"></i> 更改个人信息</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-white" href="#" onclick="showContent('users')"><i class="fa fa-users"></i> 用户管理</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-white" href="#" onclick="showContent('products')"><i class="fa fa-box"></i> 商品管理</a>
                </li>
            </ul>
            <button class="btn btn-danger mt-3 w-100" onclick="logout()">退出登录</button>
        </nav>

        <!-- 主内容区 -->
        <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
            <div id="profile" class="content-section">
                <h2 class="mt-3">更改个人信息</h2>
                <form class="card p-3">
                    <div class="mb-3">
                        <label class="form-label">用户名</label>
                        <input type="text" class="form-control" value="<%= adminUsername %>" required>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">邮箱</label>
                        <input type="email" class="form-control" required>
                    </div>
                    <button type="submit" class="btn btn-primary">保存修改</button>
                </form>
            </div>

            <div id="users" class="content-section d-none">
                <h2 class="mt-3">用户管理</h2>
                <table class="table table-striped">
                    <thead>
                    <tr>
                        <th>ID</th>
                        <th>用户名</th>
                        <th>邮箱</th>
                        <th>头像</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <!-- 动态加载用户数据 -->
                    </tbody>
                </table>
            </div>

            <div id="products" class="content-section d-none">
                <h2 class="mt-3">商品管理</h2>
                <table class="table table-striped">
                    <thead>
                    <tr>
                        <th>ID</th>
                        <th>类别</th>
                        <th>商品名称</th>
                        <th>价格</th>
                        <th>图片</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <!-- 动态加载商品数据 -->
                    </tbody>
                </table>
            </div>
        </main>
    </div>
</div>

<script>
    function showContent(section) {
        document.querySelectorAll('.content-section').forEach(el => el.classList.add('d-none'));
        document.getElementById(section).classList.remove('d-none');
    }

    function logout() {
        fetch('adminGetInfoServlet', {
            method: 'POST',
            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
            body: 'action=logout'
        }).then(() => window.location.href = '../index.jsp');
    }

    showContent('profile');
</script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
